var areaData=[];
var pointData=[];
var cityCount=0,regionCode="",regionName="";
var areaCode="",level = 0;
// 外部调用初始化控件方法
function initAreaPointData(){
	initAreaData();
	initPointData();
}

// 外部调用获取时间方法
function getAreaPointQueryParam() {
	var queryParams = {}; 
	if($(".btn-area").hasClass("on")){
		queryParams.regionCode=$(".selValue").attr("id");
		queryParams.regionName=$(".selValue").text();
	}
	if($(".btn-point").hasClass("on")){
		queryParams.pointCode=$(".selValue").attr("id");
		queryParams.pointName=$(".selValue").text();
	}
	return queryParams;
}

function initAreaPointHtml() {	
	var htmlVal = '<span class="btn-area on">按区域</span><span class="btn-point">按测点</span><span class="selValue" style="margin-left: 10px;padding: 3px;border: #2cb1d0 1px solid;background-color: #2cb1d0;color: #fff;border-radius: 4px;vertical-align: middle;"></span>';
	initAreaPointData();
    $("#areapoint").html(htmlVal);
    $(".selValue").text(areaData[0].regionName).attr("id",areaData[0].regionCode);
    $(".btn-area").bind("click",function(event){
    	$(".btn-area").addClass("on");
    	$(".btn-point").removeClass("on");
    	if(cityCount>1){
    		loadCityAreaData($(".btn-area"),"selValue");
    	}else{
    		loadAreaData($(".btn-area"),"selValue");
    	}   	
    	cancelBubble(event);
    });
    $(".btn-point").bind("click",function(event){
    	$(".btn-point").addClass("on");
    	$(".btn-area").removeClass("on");
    	loadPointData($(".btn-point"),"selValue");
    	cancelBubble(event);
    });
    $("body").bind('click',function(){  
    	$(".drawdown").hide();
    });
}

function initAreaData() {
	var url='/gems/mcs/areacode/arealist';
	ajaxProcess({
		url : url,
        data : {},
        async : false,
        successHandle : function(resp) {
        	areaData=resp.rows;   	
        	for(var i=0;i<areaData.length;i++){
        		if(areaData[i].level===2){
        			cityCount++;
        			if(i===0){
        				regionCode=areaData[i].regionCode;
        				regionName=areaData[i].regionName;
        			}
        		}
        	}
        }
	});
}
function loadAreaData(obj){
	if(areaData.length>0){
		var html='<div class="down-b commonscrollbar"><ul>';
		var className="";
		for(var i=0;i<areaData.length;i++){
			if(isEmpty($(".selValue").attr("id"))&&i===0){
				className="on";
			}else{
				if(areaData[i].regionCode===$(".selValue").attr("id")){
					className="on";
				}else{
					className="";
				}
			}
			
			html+="<li id='"+areaData[i].regionCode+"' data-level='"+areaData[i].level+"' data-name='"+areaData[i].regionName+"' onclick=\"selAreaName(this,event)\"><label style=\"width:118px;\" title=\""+areaData[i].regionName+"\" class=\""+className+"\">"+areaData[i].regionName+"</label></li>";
		}					
		html+='</ul></div>';
		var top=$(obj).offset().top+$(obj).outerHeight();
		var left=$(obj).offset().left;
		var width=260;
		if($(".drawdown").length>0){
			$(".drawdown").html(html).css("left",left).css("top",top).css("width",width).show();
		}else{
			html ='<div class="drawdown" style="display:none;">'+html+'</div>';
			$("body").append(html);
			$(".drawdown").css("left",left).css("top",top).css("width",width).show();
		}
		if($(".down-b").outerHeight()>400){
			$(".down-b").css("height",400);
		}
	}else{
		$(".drawdown").remove();
	}
}
function loadCityAreaData(obj){
	if(areaData.length>0){
		var html='<div class="region-box commonscrollbar">';
		var className="";
		var cityhtml='<div class="city"><ul>',areahtml='<div class="area"><ul>';
		for(var i=0;i<areaData.length;i++){
			if(isEmpty($(".selValue").attr("id"))&&i===0){
				className="on";
			}else{
				if(areaData[i].regionCode===$(".selValue").attr("id")){
					className="on";
				}else{
					className="";
				}
			}
			if(areaData[i].level===2){
				cityhtml+="<li id='"+areaData[i].regionCode+"' class=\""+className+"\" data-level='"+areaData[i].level+"' data-name='"+areaData[i].regionName+"' onclick=\"selCityName(this,event)\"><span title=\""+areaData[i].regionName+"\" >"+areaData[i].regionName+"</span></li>";
			}else if(areaData[i].level===3&&regionCode===areaData[i].pCode){
				if(areahtml.indexOf("data-level")==-1){
					areahtml+="<li id='"+regionCode+"' class=\""+className+"\" data-level='2' data-name='"+regionName+"' onclick=\"selAreaName(this,event)\"><span title=\""+regionName+"\" >"+regionName+"</span></li>";
				}
				areahtml+="<li id='"+areaData[i].regionCode+"' class=\""+className+"\" data-level='"+areaData[i].level+"' data-name='"+areaData[i].regionName+"' onclick=\"selAreaName(this,event)\"><span title=\""+areaData[i].regionName+"\" >"+areaData[i].regionName+"</span></li>";
			}
			
		}	
		if(areahtml.indexOf("data-level")==-1){
			areahtml+="<li id='"+regionCode+"' data-level='2' data-name='"+regionName+"' onclick=\"selAreaName(this,event)\"><span title=\""+regionName+"\" >"+regionName+"</span></li>";
		}
		cityhtml+='</ul></div>';
		areahtml+='</ul></div>';
		html+=cityhtml+areahtml+'</div>';
		var top=$(obj).offset().top+$(obj).outerHeight();
		var left=$(obj).offset().left;
		var width=260;
		if($(".drawdown").length>0){
			$(".drawdown").html(html).css("left",left).css("top",top).css("width",width).show();
		}else{
			html ='<div class="drawdown" style="display:none;">'+html+'</div>';
			$("body").append(html);
			$(".drawdown").css("left",left).css("top",top).css("width",width).show();
		}
		if($(".region-box .city ul").outerHeight()>400||$(".region-box .area ul").outerHeight()>400){
			$(".region-box").css("height",400);
		}
	}else{
		$(".drawdown").remove();
	}
}
function initPointData(areaCode) {
	var data={systemType:getUrlParam("systemType")};
	var url='/gems/mcs/stationpoint/stNoPage';
	ajaxProcess({
		url : url,
        data : data,
        async : false,
        successHandle : function(resp) {
        	pointData=resp.rows;
        }
	});
}
function loadPointData(obj){
	if(pointData.length>0){
		var html='<div class="down-b commonscrollbar"><ul>';
		var className="";
		for(var i=0;i<pointData.length;i++){
			if(isEmpty($(".selValue").attr("id"))&&i===0){
				className="on";
			}else{
				if(pointData[i].pointCode===$(".selValue").attr("id")){
					className="on";
				}else{
					className="";
				}
			}
			if(pointData[i].pointName!==''){
				html+="<li id='"+pointData[i].pointCode+"' data-name='"+pointData[i].pointName+"' onclick=\"selPointName(this,event)\"><label style=\"width:160px;\" title=\""+pointData[i].pointName+"\" class=\""+className+"\">"+pointData[i].pointName+"</label></li>";
			}
		}					
		html+='</ul></div>';
		var top=$(obj).offset().top+$(obj).outerHeight();
		var left=$(obj).offset().left;
		var width=360;
		if($(".drawdown").length>0){
			$(".drawdown").html(html).css("left",left).css("top",top).css("width",width).show();
		}else{
			html ='<div class="drawdown" style="display:none;">'+html+'</div>';
			$("body").append(html);
			$(".drawdown").css("left",left).css("top",top).css("width",width).show();
		}	
		if($(".down-b").outerHeight()>400){
			$(".down-b").css("height",400);
		}
	}else{
		$(".drawdown").remove();
	}
}
function selCityName(obj,event){
	$(".region-box .city li").removeClass("on");
	$(obj).addClass("on");
	$(".selValue").text($(obj).data("name")).attr("id",$(obj).attr("id")).data("level",$(obj).data("level"));
	regionCode=$(obj).attr("id");
	regionName=$(obj).data("name");
	var areahtml="";
	for(var i=0;i<areaData.length;i++){
		if(areaData[i].pCode===regionCode){
			if(areahtml==""){
				areahtml+="<li id='"+regionCode+"' data-level='2' data-name='"+$(obj).data("name")+"' onclick=\"selAreaName(this,event)\"><span style=\"width:118px;\" title=\""+$(obj).data("name")+"\" >"+$(obj).data("name")+"</span></li>";
			}
			areahtml+="<li id='"+areaData[i].regionCode+"' data-level='"+areaData[i].level+"' data-name='"+areaData[i].regionName+"' onclick=\"selAreaName(this,event)\"><span style=\"width:118px;\" title=\""+areaData[i].regionName+"\" >"+areaData[i].regionName+"</span></li>";
		}
	}
	if(areahtml==""){
		areahtml+="<li id='"+regionCode+"' data-level='2' data-name='"+$(obj).data("name")+"' onclick=\"selAreaName(this,event)\"><span style=\"width:118px;\" title=\""+$(obj).data("name")+"\" >"+$(obj).data("name")+"</span></li>";
	}
	$(".region-box .area ul").html(areahtml);
	cancelBubble(event);
}
function selAreaName(obj,event){
	$(".down-b ul li label").removeClass("on");
	$(obj).find("label").addClass("on");
	$(".selValue").text($(obj).data("name")).attr("id",$(obj).attr("id")).data("level",$(obj).data("level"));
	$(".drawdown").hide();
	cancelBubble(event);
}
function selPointName(obj,event){
	$(".down-b ul li label").removeClass("on");
	$(obj).find("label").addClass("on");
	$(".selValue").text($(obj).data("name")).attr("id",$(obj).attr("id"));
	$(".drawdown").hide();
	cancelBubble(event);
}
 

function initCityAreaHtml() {	
	var htmlVal = '<span class="btn-area on">城市</span><span class="btn-point">县区</span><span class="selValue" style="margin-left: 10px;padding: 3px;border: #2cb1d0 1px solid;background-color: #2cb1d0;color: #fff;border-radius: 4px;vertical-align: middle;"></span>';
	initAreaData();
	level = 2;
    $("#areapoint").html(htmlVal);
    $(".selValue").text("全部").attr("id","");
    $(".btn-area").bind("click",function(event){
    	$(".btn-area").addClass("on");
    	$(".btn-point").removeClass("on");
    	$(".selValue").text("全部").attr("id","");
    	$(".drawdown").hide();
    	areaCode="";
    	level = 2; 	
    	cancelBubble(event);
    });
    $(".btn-point").bind("click",function(event){
    	$(".btn-point").addClass("on");
    	$(".btn-area").removeClass("on");
    	loadCityData($(".btn-point"),"selValue");
    	level = 3;
    	cancelBubble(event);
    	cancelBubble(event);
    });
    $("body").bind('click',function(){  
    	$(".drawdown").hide();
    });
}
function loadCityData(obj){
	if(areaData.length>0){
		var html='<div class="city-b commonscrollbar"><ul>';
		var className="";
		if(isEmpty($(".selValue").attr("id"))||$(".selValue").attr("id")==="total"){
			className="on";
		}
		html+="<li id='total' data-name='全部' data-level=0 style='width:120px;' onclick=\"selectCity(this,event,'')\"><label style=\"width:120px;\" title='全部' class= "+className+">全部</label></li>";
		className="";
		for(var i=0;i<areaData.length;i++){
			if(areaData[i].regionCode===$(".selValue").attr("id")){
				className="on";
			}else{
				className="";
			}
			if(areaData[i].level===2){
				html+="<li id='"+areaData[i].regionCode+"' data-level='"+areaData[i].level+"' data-name='"+areaData[i].regionName+"'style='width:120px;' onclick=\"selectCity(this,event," + areaData[i].regionCode + ")\"><label style=\"width:120px;\" title=\""+areaData[i].regionName+"\" class=\""+className+"\">"+areaData[i].regionName+"</label></li>";
			}
		}					
		html+='</ul></div>';
		var top=$(obj).offset().top+$(obj).outerHeight();
		var left=$(obj).offset().left;
		var width=150;
		if($(".drawdown").length>0){
			$(".drawdown").html(html).css("left",left).css("top",top).css("width",width).show();
		}else{
			html ='<div class="drawdown" style="display:none;">'+html+'</div>';
			$("body").append(html);
			$(".drawdown").css("left",left).css("top",top).css("width",width).show();
		}
		if($(".city-b").outerHeight()>400){
			$(".city-b").css("height",400);
		}
	}else{
		$(".drawdown").remove();
	}
}

function selectCity(obj,event,regionCode){
	$(".city-b ul li label").removeClass("on");
	$(obj).find("label").addClass("on");
	$(".selValue").text($(obj).data("name")).attr("id",$(obj).attr("id")).data("level",$(obj).data("level"));
	$(".drawdown").hide();
	cancelBubble(event);
	areaCode = regionCode;
	if(isEmpty(regionCode)){
		level = 3;
	}
}